<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>我的门店</title>
		<script src="../js/mui.min.js"></script>
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link rel="stylesheet" href="../css/style.css" />
		<link rel="stylesheet" href="../css/iconfont.css" />
		<link rel="stylesheet" href="../css/sjhout.css" />
		<script type="text/javascript" charset="utf-8">
			mui.init();
		</script>
	</head>

	<body style="background-color: #fff;">
		<header class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">我的门店</h1>
		</header>
		<nav class="mui-bar mui-bar-tab">
			<a class="mui-tab-item mui-active" href="#tabbar">
				<span class="mui-icon iconfont icon-record"></span>
				<span class="mui-tab-label">收款记录</span>
			</a>
			<a class="mui-tab-item" href="myshop_lsdlist.html">
				<span class="mui-icon iconfont icon-guanli"></span>
				<span class="mui-tab-label">门店管理</span>
			</a>
		</nav>
		<div class="mui-content" style="background-color: #fff;">
			<div id="dd" class="mendxl_box" tabindex="1">
				<div class="name">所有门店</div> 
				<div class="name_con">
					<!--<p class="active"><a href="#">所有门店</a></p>
					<p><a href="#">连锁店1</a></p>
					<p><a href="#">连锁店2</a></p>-->
				</div>
			</div>
			<div class="mendsk_box">
				<div class="mendsk_item">
					<!--<div class="mdsk_timebox clearfix">
					<div class="mdsk_time">2017年07月18日</div>
					<div class="mdsk_lispri">收入：<em>¥120</em></div>
				</div>
				<ul class="mdsk_list">
					<li>
						<a href="#" class="clearfix">
							<div class="mdsk_memimg"><img src="../images/toux.jpg"></div>
							<div class="mdsk_info">
								<p class="mdsk_memnam">Acher**</p>
								<p class="mdsk_adress">郴州锦绣东路</p>
								<p class="mdsk_fktime">
									<span>07-18 13:40</span>
									<span>丨</span>
									<span>第1次消费</span>
								</p>
							</div>
							<div class="mdsk_dbpri">¥12</div>
						</a>
					</li>
					<li>
						<a href="#" class="clearfix">
							<div class="mdsk_memimg"><img src="../images/toux.jpg"></div>
							<div class="mdsk_info">
								<p class="mdsk_memnam">Acher**</p>
								<p class="mdsk_adress">郴州锦绣东路</p>
								<p class="mdsk_fktime">
									<span>07-18 13:40</span>
									<span>丨</span>
									<span>第1次消费</span>
								</p>
							</div>
							<div class="mdsk_dbpri">¥12</div>
						</a>
					</li>
				</ul>-->
				</div>

			</div>

		</div>
		<script type="text/javascript" src="../js/jquery.min.js"></script>
		<script type="text/javascript" src="../js/layer/layer.min.js"></script>
		<script type="text/javascript" src="../js/bootstrap.min.js"></script>
		<script type="text/javascript" src="../js/app.js"></script>
		<script type="text/javascript">
		
		function DropDown(el) {
			this.dd = el;
			this.aa = el;
			this.placeholder = this.dd.children('.name');
			this.placeholder = this.aa.children('.name');
			this.opts = this.dd.find('div.name_con > p');
			this.opts = this.aa.find('div.name_con > p');
			this.val = '';
			this.index = -1;
			this.initEvents();
		}
		DropDown.prototype = {
			initEvents : function() {
				var obj = this;

				obj.dd.on('click', function(event){
					$(this).toggleClass('active');
					return false;
				});

				obj.opts.on('click',function(){
					var opt = $(this);
					obj.val = opt.text();
					obj.index = opt.index();
					obj.placeholder.text(obj.val);
				});
			},
			getValue : function() {
				return this.val;
			},
			getIndex : function() {
				return this.index;
			}
		}

		$(function() {

			var dd = new DropDown( $('#dd') );
			var aa = new DropDown( $('#aa') );

			$(document).click(function() {
				// all dropdowns
				$('.mendxl_box').removeClass('active');
			});

		});
		
		$('.name_con > p').bind('click', function(){
		    $(this).addClass('active').siblings().removeClass('active');
		});

	</script>
		<script>
			$(function() {
				var agent_id = localStorage.getItem("user_agent_id");
				get_data(0);
				function setEvent(){
					$(".name_con p").bind('click', function(){
						var chain_id=$(this).data("id");
						var chain_name=$(this).data("name");
						get_data(chain_id);						
						$(".name_con li").hide();
						$(".name").text(chain_name);
						if(chain_id==0){
							$(".name").text('所有门店');
						}						
						$(this).addClass('active').siblings().removeClass('active');
					})
					
				}
				function get_data(chain_id) {
					$.ajax({
						type: 'post',
						url: APP.api_url + 'agent/chain_sy',
						data: {
							token: get_token(),
							agent_id: agent_id,
							chain_id:chain_id
						},
						success: function(data) {
							var list = data.list;
							var chains = data.chains;
							if(chains) {
								var c_html = '<p data-id=0><a href="#">所有门店</a></p>';
								for(var c in chains) {
									c_html += '<p data-id=' + chains[c]['id'] + ' data-name=' + chains[c]['name'] + '><a href="#">' + chains[c]['name'] + '</a></p>';
								}
								$(".name_con").html(c_html);
								setEvent();
							}
							if(list) {
								var html = "";
								for(var i in list) {
									var item = list[i];
									var total = item['totals'];
									html += '<div class="mdsk_timebox clearfix">' +
										'<div class="mdsk_time">' + i + '</div>' +
										'<div class="mdsk_lispri">收入：<em>¥' + total + '</em></div>' +
										'</div>' +
										'<ul class="mdsk_list">';
									for(var o in item) {
										var record = item[o];
										if(record['name']) {
											var name = record['name'];
										} else {
											var name = record['store_name'];
										}
										if(!name){
											continue;
										}
										var img=record['logo'];
										if(!img){
											img='../images/toux.jpg';
										}
										var mobile=record['mobile'];
										if(!mobile){
											mobile='';
										}
										html += '<li>' +
											'<a href="#" class="clearfix">' +
											'<div class="mdsk_memimg"><img src="'+img+'"></div>' +
											'<div class="mdsk_info">' +
											'<p class="mdsk_memnam">' + mobile + '</p>' +
											'<p class="mdsk_adress">' + name + '</p>' +
											'<p class="mdsk_fktime">' +
											'<span>' + record['add_time'] + '</span>' +
											'</p>' +
											'</div>' +
											'<div class="mdsk_dbpri">¥' + record['price'] + '</div>' +
											'</a>' +
											'</li>';
									}
									html += '</ul>';

								}
								$(".mendsk_item").html(html);
							}
						}
					});

				}
			})
		</script>

	</body>

</html>